<div class="checkbox-demo-row">
  <div class="input-demo checkbox-demo row">
    <sa-multi-checkbox [(ngModel)]="checkboxModel" [propertiesMapping]="checkboxPropertiesMapping"></sa-multi-checkbox>
  </div>
  <div class="input-demo radio-demo row">
    <div class="col-md-4">
      <label class="radio-inline custom-radio nowrap">
        <input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1">
        <span>Option 1</span>
      </label>
    </div>
    <div class="col-md-4">
      <label class="radio-inline custom-radio nowrap">
        <input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2">
        <span>Option 2</span>
      </label>
    </div>
    <div class="col-md-4">
      <label class="radio-inline custom-radio nowrap">
        <input type="radio" name="inlineRadioOptions" id="inlineRadio3" value="option3">
        <span>Option3</span>
      </label>
    </div>
  </div>
</div>
<br>
<div>
  <sa-checkbox
    [(ngModel)]="isDisabled" 
    [baCheckboxClass]="'disabled'" 
    [label]="'Disabled checkbox'" 
    [disabled]="true"
  ></sa-checkbox>
  <br>
  <div class="radio disabled">
    <label class="custom-radio nowrap">
      <input type="radio" name="optionsRadios" id="optionsRadios3" value="option3" disabled>
      <span>Disabled option</span>
    </label>
  </div>
</div>
<hr>
<div class="custom-control custom-switch">
  <input type="checkbox" class="custom-control-input" id="customSwitch1">
  <label class="custom-control-label" for="customSwitch1">Toggle this switch element</label>
</div>
<div class="custom-control custom-switch">
  <input type="checkbox" class="custom-control-input" disabled id="customSwitch2">
  <label class="custom-control-label" for="customSwitch2">Disabled switch element</label>
</div>
